<template>
   
  <div class="">
    <!-- <p>仓库中的数据是：{{ store.count }}</p>
    <p>仓库中数据的2倍：{{ store.doubleCount }}</p> -->
    <p>仓库中的数据是：{{ count }}</p>
    <p>仓库中数据的2倍：{{ doubleCount }}</p>
    <p>
      <button @click="store.changeCount(400)">改变仓库中的值</button>
    </p>
    <p>
      <button @click="store.asyncChangeCount(666)">异步的改变仓库中的值</button>
    </p>
  </div>
</template>

<script lang="ts" setup>
import { storeToRefs } from 'pinia'
import { useCounterStore } from '../store/counter'
const store = useCounterStore()
const { count, doubleCount } = storeToRefs(store)
</script>

<style scoped></style>
